import { observable, action, configure, computed } from "mobx";
configure({ enforceActions: "always" });

export default class HomeStore {
  @observable
  num: number = 38;

  @observable
  _isVisualPop: boolean = false;

  @observable
  images: Array<string> = [];

  constructor() {}

  @computed
  get isVisualPop() {
    return this._isVisualPop;
  }

  set isVisualPop(isVisualPop: boolean) {
    this._isVisualPop = isVisualPop;
  }

  @action
  plus = () => {
    this.num += 1;
  };

  @action
  minus = () => {
    this.num -= 1;
  };

  @action
  appendOneImage = (imgPath: string) => {
    this.images.push(imgPath);
  };

  @action
  deleteOneImage = (index: number) => {
    this.images.splice(index, 1);
  };

  @action
  removeAllImages = () => {
    this.images = [];
  };
}

const homeStore = new HomeStore();

export { homeStore };
